{extend name="../application/public/base.html" /}
{block name="head"}
    <link rel="stylesheet" href="ADMIN_CUSTOM/css/list.css">
    <link rel="stylesheet" href="ADMIN_CUSTOM/css/btn.css">
    <link rel="stylesheet" href="ADMIN_CUSTOM/css/form.css">
{/block}
{block name="body"}
    <body>
        <div class="x-nav">
          <span class="layui-breadcrumb">
            <a href="">首页</a>
            <a href="">演示</a>
            <a><cite>导航元素</cite></a>
          </span>
          <a class="layui-btn layui-btn-small" style="line-height:1.6em;margin-top:3px;float:right" onclick="location.reload()" title="刷新">
            <i class="layui-icon layui-icon-refresh" style="line-height:30px"></i></a>
        </div>
		<div class="layui-fluid">
		    <div class="layui-row layui-col-space15">
		        <div class="layui-col-md12">
                    <form class="layui-form">
                        <div class="layui-card">
                            <div class="layui-card-body layui-col-space30">
                                <div class="layui-input-inline layui-show-xs-block">
                                    <label style="padding: 0 3px 0 0;">操作者</label>
                                    <div class="layui-input-inline">
                                        <select name="admin_id" lay-filter="admin_id" class="layui-select">
                                            <option value="">所有操作者</option>
                                            {volist name="admin" id="v"}
                                            <option value="{$v.admin_id}">{$v.nkname}</option>
                                            {/volist}
                                        </select>
                                    </div>
                                </div>
                                <div class="layui-input-inline layui-show-xs-block">
                                    <label style="padding: 0 3px 0 0;">操作类型</label>
                                    <div class="layui-input-inline">
                                        <select name="type" class="layui-select">
                                            <option value="">所有操作类型</option>
                                            {volist name="type" id="v" key="key"}
                                            <option value="{$key-1}">{$v}</option>
                                            {/volist}
                                        </select>
                                    </div>
                                </div>
                                <!-- <div class="layui-btn zcc-activit-btn" style="margin-left: 10px;">本月(默认)</div>
                                <div class="layui-btn">上月</div>
                                <div class="layui-btn">日期自定义</div> -->
                                <div class="layui-input-inline layui-show-xs-block">
                                    <div class="layui-input-inline">
                                        <select name="time_type" lay-filter="time_type" class="layui-select">
                                            <option value="1">本月(默认)</option>
                                            <option value="2">上月</option>
                                            <option value="3">自定义</option>
                                        </select>
                                    </div>
                                    <div class="layui-input-inline zcc-time-input">
                                        <input type="text" name="start" placeholder="开始日" id="start" class="layui-input">
                                    </div>
                                    <div class="layui-input-inline zcc-time-input">
                                        <input type="text" name="end" placeholder="结束日" id="end" class="layui-input">
                                    </div>
                                </div>
                                <div class="layui-input-inline layui-show-xs-block">
                                    <div class="layui-input-inline" style="width: 200px;">
                                        <input type="text" name="search" placeholder="请输入关键字进行检索" class="layui-input">
                                    </div>
                                    <div class="layui-input-inline layui-show-xs-block">
    	                                <div class="layui-btn" lay-submit="" lay-filter="search" ty="0">
    	                                    <i class="layui-icon">&#xe615;</i></div>
    	                            </div>
                                </div>
                            </div>
                        </div>
                        <div class="layui-card">
                            <div class="layui-card-body">
                                <span class="zcc-title">操作日志</span>
                                <div class="layui-btn" lay-submit lay-filter="search" ty="1">导出</div>
                            </div>
                        </div>
                    </form>
		            <div class="layui-card">
                        <div class="layui-card-body">
                            <!-- 操作日志 start -->
                            <div class="layui-tab layui-tab-card" style="margin-bottom:15px;">
                                <div class="layui-tab-content">
                                    <table class="layui-table layui-form" id="table-list" lay-filter="table-list">
                                    </table>
                                </div>
                            </div>
                            <!-- 操作日志 end -->
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </body>
{/block}
{block name="script"}    
    <script type="text/javascript">
        layui.use(['laydate','form','table'], function(){
            var laydate = layui.laydate;
            var form = layui.form;
            var $ = layui.$;
            var table = layui.table;

            //执行一个laydate实例
            laydate.render({
                elem: '#start' //指定元素
            });

            //执行一个laydate实例
            laydate.render({
                elem: '#end' //指定元素
            });
            /*@初始化table*/
            var tableObj = table.render({
                elem: '#table-list',
                id: 'test',
                url: '/log/log/index', //数据接口
                page: true, //开启分页
                // where: {u_type:'新客'},
                cols: [[ //表头
                    {field: 'id', title: '序号'},
                    {field: 'addtime', title: '操作时间'},
                    {toolbar:'<div>{{d.admin.account}}</div>', title:'操作者'},
                    {toolbar:'<div>{{d.admin.nkname}}</div>', title:'操作员工'},
                    {field: 'type_text', title: '操作类型'},
                    {field: 'content', title: '操作事件'},
                ]],
                done: function (res, page, count){
                    exportData = res.data
                }
            });
            /*@导出*/
            // export_xls = function (){
            //     tableObj.reload({
            //         page: {
            //             page: 1, //重新从第 1 页开始
            //             limit: 100,
            //         },
            //         // where: data.field
            //     });
            //     layer.confirm('确定导出', {icon: 3, title:'提示'}, function(index){
            //         layer.close(index);
            //         table.exportFile(tableObj.config.id,exportData, 'xls');
            //     })
                
            // }
            /*@查询*/
            form.on('submit(search)',function(data){
                if(data.field.time_type == 3){
                    if(data.field.start != '' && data.field.end != ''){
                        var startDate = new Date(data.field.start).getTime();
                        var endDate = new Date(data.field.end).getTime();
                        if(startDate > endDate){
                            layer.msg('开始时间不能大于结束时间',{icon: 2})
                            return false
                        }
                    }
                }
                /*@重载表格数据*/
                if( $(data.elem).attr('ty') == 1 ){
                    //导出
                    obj = data.field
                    obj.limit = 'limit'
                    layer.confirm('确定导出', {icon: 3, title:'提示'}, function(index){
                        layer.close(index);
                        $.get('/log/log/index',obj,function(data){
                            table.exportFile(tableObj.config.id,data.data, 'xls');
                        })
                    })
                    
                }else{
                    //查询
                    tableObj.reload({
                        page: {
                            page: 1 //重新从第 1 页开始
                        },
                        where: data.field
                    });
                }
                return false
            })
            /*@时间选择*/
            form.on('select(time_type)',function(data){
                if(data.value == 3){
                    $('.zcc-time-input').css('display','inline-block')
                }else{
                    $('.zcc-time-input').css('display','none')
                }
            })

        });
        
    </script>
{/block}